<template>
	<view class="content">
		<div class="homebj">
			<div class="homebanner">
				<view class="swiper-container">
					<swiper :indicator-dots="true" :autoplay="true" :interval="10000" :duration="1000">
						<swiper-item>
							<view class="swiper-item">
								<image :src="getImg('banner00.jpg')"></image>
							</view>
						</swiper-item>
						<swiper-item>
							<view class="swiper-item">
								<image :src="getImg('banner01.jpg')"></image>
							</view>
						</swiper-item>
					</swiper>
				</view>
				<div class="bannertop">
					<div class="sousuo">
						<input type="text" class="sousuoinput">
						<div class="sousuoimg">
							<image style="width: 15px;height: 15px;" :src="getImg('sousuoimg.png')"></image>
						</div>
					</div>
					<div class="grzx" @click="nato('./center')">
						<image :src="getImg('ra-hd-icon-wode@2x.png')"></image>
					</div>
				</div>
			</div>
			<!-- 分类 -->
			<div class="homeover">
				<div class="homefl">
					<div class="homefltop" :style="{width:lmwidth+'px'}">
						<div class="homefllist" v-for="(el,ind) in labdatas" @click="tabclick(el.id)"
							v-if="el.num > 0 ">
							<a>
								<div class="homefllistname">{{el.name}}</div>
								<div class="listnum">{{el.num}}</div>
							</a>
						</div>
					</div>
				</div>
			</div>
			<!-- 活动单位 -->
			<div class="homehddw">
				<div class="hometitle">
					<div class="tit">活动单位</div>
					<div class="ditu">
						<view class="dtnn" @click="nato('./hddt')">地图模式<image style="width: 13px;height: 15px;"
								:src="getImg('ra-hd-icon-hddt@2x.png')"></image>
						</view>
					</div>
				</div>
				<div class="homehddwlistall">
					<div class="homehddwlist" v-for="(el,ind) in dwDatas" @click="dwxqclick(el.waresId)">
						<div class="homehddwtop">
							<image :src="getImg('noimg.png')" class="homehddwimg" v-if="el.typeImg == ''"></image>
							<image :src="getImg1(el.typeImg)" class="homehddwimg" v-if="el.typeImg != ''"></image>
							<div class="homehddwlistbq">
								<image :src="getImg('hddwred.png')" class="homehddwlistbqimg"></image>
								<div class="homehddwlistbqname">开展{{el.num}}场活动</div>
							</div>
							<div class="homehddwlistjl">
								<image :src="getImg('hddwjl.png')" class="homehddwlistjlimg"></image>
								<div class="homehddwlistjlname">{{el.distance}}</div>
							</div>
						</div>
						<div class="homehddwbottom">
							<div class="homehddwname">{{el.name}}</div>
							<div class="homehddwtag">
								<div class="homehddwtaglist" v-for="(el1,ind1) in el.lables" v-if="ind1<2">{{el1.name}}
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- 活动列表 -->
			<div class="homermqnzj">
				<div class="hometitle">
					<div class="tit">活动列表</div>
					<div class="ditu">
						<view class="dtnn" @click="nato('./hdlb')">查看更多<image style="width: 13px;height: 15px;"
								:src="getImg('ra-hd-icon-jiantou@2x.png')"></image>
						</view>
					</div>
				</div>
				<div class="homermqnzjall">
					<div class="homermqnzjlist" v-for="(el,ind) in datas" @click="hdxqclick(el.id)">
						<div class="homermqnzjleft dwxqleft">
							<image v-if="el.typeImg != ''" :src="getImg1(el.typeImg)" class="rmqnzjimg1"></image>
							<image v-if="el.typeImg == ''" :src="getImg('noimg.png')" class="rmqnzjimg1"></image>
							<image v-if="el.type == 0" :src="getImg('hdxqjxzicon.png')" class="rmqnzjimg2 dwxqwcimg">
							</image>
							<image v-if="el.type == 1" :src="getImg('hdxqjxz.png')" class="rmqnzjimg2 dwxqwcimg">
							</image>
							<image v-if="el.type == 2" :src="getImg('hdxqjxzactive.png')" class="rmqnzjimg2 dwxqwcimg">
							</image>
						</div>
						<div class="homermqnzjright">
							<div class="homermqnzjname">{{el.name}}</div>
							<div class="sy-dizhi">负责人：{{el.header}}</div>
							<div class="dwxqmsdes">{{el.place}}</div>
							<div class="dwxqmsdtime">
								<div class="dwxqmsdtimename">
									{{el.start_time}}-{{el.end_time}}
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="homermqnzj" v-if="cgdatas.length > 0">
					<div class="hometitle">
						<div class="tit">场馆列表</div>
						<div class="ditu">
							<view class="dtnn" @click="nato('./cglb')">查看更多<image style="width: 13px;height: 15px;" :src="getImg('ra-hd-icon-jiantou@2x.png')"></image>
							</view>
						</div>
					</div>
				    <div class="homermqnzjall">
				        <div class="homermqnzjlist" v-for="(el,ind) in cgdatas" @click="cgxqclick(el.id)">
				            <div class="homermqnzjleft dwxqleft">
				                <img v-if="el.typeImg != ''" :src="getImg1(el.typeImg)" class="rmqnzjimg1">
				                <img v-if="el.typeImg == ''" :src="getImg('noimg.png')"  class="rmqnzjimg1">
				            </div>
				            <div class="homermqnzjright">
				                <div class="homermqnzjname">{{el.name}}</div> 
				                <div class="dwxqms-ms">{{el.description}}</div>
				            </div>
				        </div>
				    </div>
				</div>
			</div>
		</div>
	</view>
</template>

<script>
	import web from '../../components/utils/request.js'
	export default {
		data() {
			return {
				dwDatas: [],//创办过活动的单位列表
				datas: [],//所有的单位列表
				labdatas: [],//标签数据
				longitude: '120.223073',//当前经度
				latitude: '30.185294',//当前维度
				num: 7,
				cgdatas: [],
				lmwidth:0
			}
		},
		onLoad() {
			var that=this;
			web.loginUser(function(res){
				console.log(res)
				uni.setStorageSync('session',res.data.rd_session)
				setTimeout(function(){
					that.getData4();
				},1000)
			});
		},
		onShow() {
			var that = this;
			setTimeout(function() {
				that.map_loc()
			}, 60000)

		},
		onReady() {
			this.getData1();
			this.getData3();
			this.getData2();
		},
		methods: {
			nato(url){
				console.log(1111)
				uni.navigateTo({
					url:url
				})
			},
			getImg(url) {
				return 'https://ruianm.tour-ma.com/r/cms/www/m/huodong/img/' + url;
			},
			getImg1(url) {
				return 'https://ruianm.tour-ma.com' + url;
			},
			map_loc: function() {
				uni.getLocation({
					type: 'gcj02',
					success: function(res) {
						console.log(res);
					},
					fail: function(res) {
						console.log(res);
					}
				});
			},
			getSession() {
				var url = "/minapps/login.jspx";
				var arg = {};
				var that = this;
				web.httpPost(that, url, arg, function(res) {
				})
			},
			getData1() {
				var url = "/wareList.jspx";
				var arg = {
					lon: this.longitude,
					lat: this.latitude
				};
				var that = this;
				web.httpPost(that, url, arg, function(res) {
					that.dwDatas = res.data.data;
				})
			},
			getData2() {
				var url = "/labInclude.jspx";
				var arg = {
					id: 0
				};
				var that = this;
				web.httpPost(that, url, arg, function(res) {
					that.datas = [];
					var json = res.data.data;
					for (let i = 0; i < json.length; i++) {
						if (json[i].id == 2 || json[i].id == 3 || json[i].id == 4 || json[i].id == 5) {

						} else {
							if (i < 5) {
								that.datas.push(json[i]);
							}
						}
					}
				})
			},
			getData3() {
				var url = "/labDatas.jspx";
				var arg = {};
				var that = this;
				web.httpPost(that, url, arg, function(res) {
					var json = res.data.data;
					that.labdatas = json;
					var num = Math.ceil((json.length / 2)+1) * 95;
					that.lmwidth = num;
				})
			},
			getData4() {
				var url = "/venues.jspx";
				var arg = {
					pageNo: 1,
					num: 5,
					hdtype: 1
				};
				var that = this;
				web.httpPost(that, url, arg, function(res) {
					that.cgdatas = [];
					for (let i = 0; i < res.data.data.length; i++) {
						if (i < 5) {
							that.cgdatas.push(res.data.data[i]);
						}
					}
				})
			},
			hdxqclick: function(id) { //点击进入活动详情
				uni.navigateTo({
					url: './hdxq?id=' + id
				})
			},
			dwxqclick: function(waresId) { //点击进入详情页
				uni.navigateTo({
					url: './dwxq?id=' + waresId
				})
			},
			labdatasclick: function() { //显示所有的标签
				this.num = this.labdatas.length;
				// $('#homefllist').hide();
			},
			cgxqclick: function(id) { //点击跳转场馆预定
				uni.navigateTo({
					url: './cgyd?id=' + id + "&book_time="
				})
			},
			tabclick: function(id) {
				uni.navigateTo({
					url: './hdbq?id=' + id
				})
			}
		}
	}
</script>

<style>
	@import url("@/components/css/datascss.css");

	.swiper-container {
		width: 375px;
		height: 240px;
	}

	swiper {
		width: 375px;
		height: 240px;
	}

	.swiper-item {
		width: 100%;
		height: 100%;
	}
</style>
